<!DOCTYPE html>
<html lang="en">
<!--html5可以没有 <head>元素-->
    <meta charset="UTF-8">
    <title>HTML5迁移</title>
<style>
  body {
    font-family:Verdana,sans-serif;font-size:0.8em;
  }
  header,footer,section,article,nav{
    border:1px solid grey;
    margin:5px;margin-bottom:15px;padding:8px;
    background-color:white;
  }
  header,footer {
    color:white;background-color:#444;margin-bottom:5px;
  }
  section {
    background-color:#ddd;
  }
  nav ul {
    margin:0;padding:0;
  }
  nav ul li {
    display:inline; margin:5px;
  }
</style>
<body>
<!--把 id="header"修改为 HTML5 语义元素 <header>-->
<!--  <div id="header">-->
    <header>
      <h1>HTML迁移</h1>
    </header>
<!--  </div>-->
<!--将 id="menu"的<div>元素修改为语义元素<nav>-->
<!--<div id="menu">-->
<nav>
  <ul>
    <li><a href="#">链接1</a></li>
    <li><a href="#">链接2</a></li>
    <li><a href="#">链接3</a></li>
  </ul>
</nav>
<!--将id="content"的<div>元素修改为<section>-->
<!--<div id="content">-->
<section>
  <h2>舞种</h2>
  <!--将id="post"的<div>元素修改为<article>-->
<!--  <div id="post">-->
  <article>
    <h2>breaking</h2>
    <p>霹雳舞/地板舞</p>
  </article>
  <article>
    <h2>hip-hop</h2>
    <p>自由式街舞</p>
  </article>
  <article>
    <h2>locking</h2>
    <p>锁舞</p>
  </article>
</section>
<footer>
  <p align="center" style="font-size: 15px">@街舞</p>
</footer>

</body>
</html>